<!DOCTYPE html>
<html>
<head>
    <title>加载遮罩</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="../../themes/bootstrap/cetc54.ui.all.css">

</head>
<body>

<button type="button" class="button" onclick="show()">显示</button>
<button type="button" class="button" onclick="show1()">显示(容器)</button>
<button type="button" class="button" onclick="hide1()">关闭(容器)</button>
<div id="container" style="width: 400px;height: 400px;border: solid #000000 1px;">
    <button>集中</button>
    <select>
        <option>123</option>
    </select>
    <iframe width="20px" height="20px"></iframe>
    <object></object>
</div>
</body>
<script type="text/javascript" src="../../lib/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="../../release/cetc54.ui.all.js"></script>
<script>
    var loading;
    function show() {
        loading = $.uiLoading.show({
            text: '数据正在加载……',
            width: 140
        })
    }
    var loading1;
    function show1() {
        loading1 = $.uiLoading.show({
            delay:1000,
            container: $('#container')
        })
    }
    function hide1() {
        $.uiLoading.hide({
            container: $('#container')
        });
    }
</script>
</html>